<template>
  <div>我是Demo组件</div>
  <slot>8888</slot>
  <button @click="test">测试触发一下Demo组件的Hello事件</button>
  <slot name="ykMsg">我是默认值</slot>
<h2>当前点击时鼠标的坐标为x:{{point.x}},y: {{point.y}}</h2>
</template>

<script>
import usePoint from '@/hooks/usePoint';
import {reactive} from 'vue'
export default {
    name:'Demo',
    props:['msg','school'],
    // emit:['hello'], // 我知道你给我绑定了hello事件
    beforeCreate () {
        console.log('---beforeCreate---');
    },
    setup(props,context){
        let a = '***'
        console.log('---setup---',context);
        // 数据 
        let person = reactive({
            name: '小明',
            age: 18
        })
        const point = usePoint()

        // 方法
        function test(){
            context.emit('hello','**子组件的信息**')
        }
        // 返回一个对象（常用）
        return {
            person,
            test,
            point
        }
   }
}

</script>
<style scoped>
</style>